import 'package:flutter/material.dart';

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() {
    return _HomeScreenState();
  }
}

class _HomeScreenState extends State<HomeScreen> {
  List<NavigationIconView> _navigationViews;

  @override
  Widget build(BuildContext context) {
    final BottomNavigationBar botNavBar = new BottomNavigationBar(
      items: _navigationViews
          .map((NavigationIconView navigationView) => navigationView.item)
          .toList(),
      currentIndex: 0,
      type: BottomNavigationBarType.fixed,
      onTap: (int index) {
        print("点击的是第$index个Tab");
      },
    );

    return MaterialApp(
        title: '微信',
        theme: ThemeData(primarySwatch: Colors.lightBlue),
        debugShowCheckedModeBanner: false,
        home: Scaffold(
          appBar: AppBar(
            title: Text(
              '微信',
              style: TextStyle(color: Colors.white),
            ),
            backgroundColor: Color(0xff303030),
          ),
          body: Container(
            color: Colors.pink,
          ),
          bottomNavigationBar: botNavBar,
        ));
  }

  @override
  void initState() {
    super.initState();
    _navigationViews = [
      NavigationIconView(
          title: '微信',
          icon: Icon(Icons.message),
          activeIcon: Icon(Icons.message)),
      NavigationIconView(
          title: '通讯录',
          icon: Icon(Icons.phone),
          activeIcon: Icon(Icons.phone)),
      NavigationIconView(
          title: '发现',
          icon: Icon(Icons.search),
          activeIcon: Icon(Icons.search)),
      NavigationIconView(
          title: '我的',
          icon: Icon(Icons.person),
          activeIcon: Icon(Icons.person)),
    ];
  }
}

class NavigationIconView {
  final String _title;

  final Widget _icon;

  final Widget _activeIcon;

  final BottomNavigationBarItem item;

  NavigationIconView({Key key, String title, Widget icon, Widget activeIcon})
      : _title = title,
        _icon = icon,
        _activeIcon = activeIcon,
        item = new BottomNavigationBarItem(
            icon: icon,
            activeIcon: activeIcon,
            title: Text(title),
            backgroundColor: Colors.white);
}
